.lt-tr{
    width: 100%;
    box-sizing: border-box;
    display: block;
}
.lt-tr *{
    box-sizing: border-box;
}
.lt-tr .list-box{
    width:200px;height:100%;

}
.lt-tr .left{
    float: left;
}.lt-tr .right{
     float: right;
 }
.lt-tr .list-box>ul>li i{
    margin-right: 1px;margin-left: 4px;min-width: 20px;
}
[svg-index]{}
[key]{}
.lt-tr .list-box .list-header{
    width:100%;height:30px;line-height: 30px;
    border: 1px solid #ddd;
    padding: 0 2px;text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.lt-tr .list-box>ul{
    width: 100%;height: calc(100% - 36px);
    margin: 2px 0;
    border-bottom: 1px solid #ddd;
    display: block;
    overflow: auto;
    line-height: 22px;text-align: left!important;font: 14px Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.lt-tr .list-box>ul.lul{
    padding: 3px 0 3px 3px;
}
.lt-tr .list-box>ul.rul{
    padding: 3px 3px 3px 0;
}
.lt-tr .list-box.left>ul{
    direction: rtl;
}
.lt-tr .list-box>ul>li:not(.active){
    border: 1px solid lightgrey;
}
.lt-tr .list-box>ul>li{
    height: 32px;
    line-height: 32px;
    padding: 0 10px;
    list-style: none;
    margin: 5px 0;
    display: list-item;
    text-align: -webkit-match-parent;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    cursor: pointer;
    overflow: hidden;
    width: 100%;
    position: relative;
}

.lt-tr .list-box>ul>li.disabled{
    background-color: lightgrey!important;
    cursor: not-allowed;
    color: #aaa!important;
    border: 1px solid lightgrey!important;
    box-shadow: none!important;
}
.lt-tr.sm .list-box>ul>li{
    height: 32px;
    line-height: 32px;
    border-radius: 7px;
}
.lt-tr.md .list-box>ul>li{
    height: 42px;
    line-height: 42px;
    border-radius: 8px;
}
.lt-tr.lg .list-box>ul>li{
    height: 52px;
    line-height: 52px;
    border-radius: 9px;
}
.lt-tr .list-box.left>ul>li{
    direction: ltr;
}
.lt-tr .list-box>ul>li:not(.active):not(.disabled):hover{
    background-color: #0099ff;color: white;border: none;box-shadow: 0 0 10px 0 #0099ff;
}
.lt-tr .list-box>ul>li.active:hover{
    background-color: #44aadd;color: white;border: none;box-shadow: 0 0 10px 0 #0099ff;
}

.lt-tr .list-box>ul>li.active{
    background-color: #0099ff;color: white;
}
.draw-line{
    stroke: #0099ff;stroke-width:2;
    fill: #0099ff;cursor: pointer;
}
.draw-line[id*=drea_temp_mark]{
    stroke-dasharray: 3,2;
}
.draw-line:hover{
    stroke-width:3;
    stroke-dasharray: 3,2;
    stroke: #0099ff;
}



.lt-tr .list-box>ul>li>div {
    width: 100%;height: 100%;display: flex;flex-direction: row;
}
.lt-tr .list-box>ul>li>div>span:not(.svg-close) {
    white-space: nowrap;
    overflow: hidden;
    flex: 1;
    text-overflow: ellipsis;
    display: inline-block;
    width: 100%;
    height: 100%;
}
.lt-tr .list-box>ul>li>div>span.svg-close {
    font-size: 20px;
}
.lt-tr .list-box>ul>li>div>span.svg-close:hover {
    font-size: 22px;
}

::-webkit-scrollbar{
    width: 7px;
    height: 7px;
    background-color: #F5F5F5;
}
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px white;
    -webkit-box-shadow: inset 0 0 6px white;
    border-radius: 10px;
    background-color: #F5F5F5;
}
::-webkit-scrollbar-thumb{
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .1);
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .1);
    background-color: lightgrey;
}